<template>
  <div class="container">
    <div style="">
      <div class="card_title">
        <img src="~@/assets/report/first/edit.png" />
        <span>总结</span>
      </div>
      <div class="card_content" v-if="status != 1">
        <a-input
          type="textarea"
          v-model="report.summary"
          :max-length="200"
          palceholder="请输入总结建议，200字内"
        ></a-input>
        <div style="display:flex;justify-content: flex-end;">
          <a @click="handleTemplate" :style="{ display: 'inline-block', marginRight: '20px', color: 'red' }">
            从模版选择
          </a>
          <a :style="{ display: 'inline-block', color: 'red' }" @click="handleTemplateSave">
            保存到模版
          </a>
        </div>
        <a-modal
          :visible="saveVisit"
          title="保存到模版"
          ref="saveVisit"
          width="500px"
          @ok="handleOk"
          @cancel="handleCancel"
          :confirm-loading="typeConfirmLoading"
        >
          <a-form-model ref="editform" :model="category" :rules="validatorRules">
            <a-form-model-item label="分类名称" :labelCol="{ span: 4 }" :wrapperCol="{ span: 8 }" prop="categoryType">
              <a-select placeholder="请选择分类" v-model="category.categoryType">
                <a-select-option v-for="item in list" :key="item.dataId" :value="item.dataId">{{
                  item.categoryName
                }}</a-select-option>
              </a-select>
            </a-form-model-item>
          </a-form-model>
        </a-modal>
        <advise-template ref="modalForm" @ok="modalFormOk"></advise-template>
      </div>
      <div class="card_content" v-else>
        <p>{{ report.summary }}</p>
      </div>
    </div>
  </div>
</template>

<script>
import AdviseTemplate from '../../../bloodProfile/modules/AdviseTemplate'
import { PAGE_MENU_TYPE } from '@/store/mutation-types'
import { postAction } from '@/api/manage'
import { mapGetters } from 'vuex'
export default {
  name: 'Total',
  props: ['report', 'status'],
  components: { AdviseTemplate },
  data() {
    return {
      saveVisit: false,
      category: {},
      typeConfirmLoading: false,
      list: [],
      validatorRules: {
        categoryType: [{ required: true, message: '请选择分类' }]
      }
    }
  },
  computed: {},
  created() {
    this.getType()
  },
  methods: {
    ...mapGetters(['orgCode']),
    getType() {
      postAction('/suggest/category/list', { orgCode: this.orgCode() }).then(res => {
        if (res.success) {
          this.list = res.result
        } else {
          console.log(res.message)
        }
      })
    },
    handleOk() {
      this.$refs.editform.validate(valid => {
        if (valid) {
          const params = {
            patientId: this.$route.query[PAGE_MENU_TYPE.PatientId],
            signinType: this.category.categoryType,
            suggestContent: this.category.suggestContent,
            orgCode: this.orgCode()
          }
          postAction('/201/02/2010219', params).then(res => {
            if (res.success) {
              this.$message.success(res.message)
              this.handleCancel()
            } else {
              this.$message.warning(res.message)
            }
          })
        }
      })
    },
    handleCancel() {
      this.saveVisit = false
    },
    handleTemplateSave() {
      if (!this.report.summary) {
        this.$message.warning('请填写总结')
        return
      }
      this.category.suggestContent = this.report.summary
      this.saveVisit = true
    },
    handleTemplate() {
      this.$refs.modalForm.add()
    },
    modalFormOk(item) {
      this.report.summary = item
    }
  }
}
</script>

<style lang="less" scoped>
.container {
  padding: 50px 24px 0 24px;
}
.card_content {
  margin-top: 15px;
}
.card_title {
  display: flex;
  align-items: center;
  img {
    width: 25px;
    height: 25px;
    margin-right: 10px;
  }
  span {
    font-size: 20px;
    font-weight: bold;
    color: #000;
  }
}
</style>

